Packing widgets

預設情況下，row或column沿其main axis會使用盡可能多的空間，但如果你想把children widget緊緊地包在一起，可以將mainAxisSize設成MainAxisSize.min

Row(
  mainAxisSize: MainAxisSize.min,
  children: [
    Icon(Icons.star, color: Colors.green[500]),
    Icon(Icons.star, color: Colors.green[500]),
    Icon(Icons.star, color: Colors.green[500]),
    const Icon(Icons.star, color: Colors.black),
    const Icon(Icons.star, color: Colors.black),
  ],
)

上面的程式碼就是使用MainAxisSize.min將star icon緊密排列在一起

Common layout widgets

flutter有非常多種類的widget，前面介紹了各種widget排版會用到的基礎，接下來我會介紹各種常用的widget，一般常看到的widget來自widget library，然而有些比較特殊的會來自Material library

Standard widgets

• Container: 向widget添加padding、邊距、邊框、背景顏色或其他裝飾
• GridView: 將widget變為可滾動的grid
• ListView: 將widget變為可滾動的list
• Stack: 將一個widget重疊在另一個之上

Material widgets

• Card: 將各種想要的訊息(text, image等等...)編輯進一個帶有圓角和陰影的框中
• ListTile: 將最多3行text以及可選擇的leading icons和trailing icons編輯成一行

Container

container最重要的功能就是裝飾widget，如上面所述，可以添加padding、邊距、邊框、背景顏色或其他裝飾在widget上，可以使用decoration屬性裡的BoxDecoration()

Widget _buildImageColumn() {
  return Container(
    decoration: const BoxDecoration(
      color: Colors.black26,
    ),
    child: Column(
      children: [
        _buildImageRow(1),
        _buildImageRow(3),
      ],
    ),
  );
}

參考資料:
https://docs.flutter.dev/development/ui/layout